<div class="container">
  <h3 id="heading">Your Users</h3>

<div my-loading-spinner="viewLoading">
    <div class="table-responsive">
      <table class='table'>
        <tr>
          <th></th>
          <th>ID</th>
          <th>Name</th>
          <th>Email</th>
          <th>Role</th>
          <th></th>
          <th></th>
          <th></th>
        </tr>

        <tr data-id="{{user.id}}" data-model="user" ng-repeat="user in users" class="fade" ng-class="{in: !viewLoading}">

            <td>
              <img id="{{user.id}}" src="/images/online.png" ng-show="user.online">
              <img id="{{user.id}}" src="/images/offline.png" ng-hide="user.online">
            </td>
          <td>{{user.id}}</td>
          <td>{{user.name}}</td>
          <td>{{user.email}}</td>
            <td>
              <img src="/images/admin.png" ng-show="{{user.admin}}">
              <img src="/images/pawn.png" ng-hide="{{user.admin}}">
            </td>
          <td><a href="#/user/{{user.id}}" class="btn btn-sm btn-primary">Show</a></td>
          <td><a href ng-click="unsubscribe()" class="btn btn-sm btn-warning">Edit</a></td>

          <td><a href class="btn btn-sm btn-danger" ng-click="deleteUser(user.id)">Delete</a></td>

        </tr>
      </table>
      </div>
  </div>

  <div ui-view></div>
</div>